<template>
    <div class="exchange">
        <div class="exchangeTitle">
            <h3>商品名</h3>
            <h3>兑换时间</h3>
        </div>
            <ul v-for="item in list" :key="item._id">
                <li>{{item.name}}</li>
                <div>{{item.exchangeDate | filterTime}}</div>
            </ul>
    </div>
</template>


<script>
import { get } from "../../utils/fecth";
// import moment from 'moment'
export default {
    name:'exchange',
    data() {
        return {
            list:this.$store.state.exchange,
            user: JSON.parse(localStorage.getItem('a')),
            // data: moment().format('YYYY-MM-DD HH:mm:ss')
        }

    },
    created() {
        this.fun()     
    },
    methods: {
        async fun(){
            const data2 = await get('shop/exchangedRecord',{id:this.user._id})
            this.$store.state.exchange=data2
            localStorage.setItem('exchange',JSON.stringify(this.$store.state.exchange))
            console.log(data2)
        }
    },
    filters:{
        filterTime(time){
            var year = new Date(time).getFullYear()
            var month = new Date(time).getMonth()+1
            var day = new Date(time).getDate()
            var h = new Date(time).getHours()
            var m = new Date(time).getMinutes()
            // var s = new Date().getSeconds() 
            console.log(time)
            return `${year}-${month}-${day}:${h}:${m}`
        },
    }
   
}
</script>

<style lang="scss">
.exchange{
    width: 100%;
    .exchangeTitle{
        display: flex;
        justify-content: space-between;
    }
    ul{
        width: 100%;
        border: 1px solid rgb(150, 149, 149);
        list-style: none;
        display: flex;
        justify-content: center;
        padding: 0;
        text-align: center;
        line-height: 80px;
        li{
            width: 70%;
            height: 80px;
        }
        div{
            width: 30%;
            height: 80px;
        }
    }
}
</style>